import * as utils from "/@/utils/index"
import { isFunction } from "lodash"
export interface Mapper {
  // Field 对象中的key, 支持多个层嵌套, 以 . 分割
  key: string
  // 映射后的key, , 支持多个层嵌套, 以 . 分割
  mKey: string
  mValue?: number | string | Function | boolean
}
type MapperType = {
  [key: string]: Mapper[]
}

/**
 * 组件公共映射
 */
const widgetCommonMapper: Mapper[] = [
  { key: "props.formItemField", mKey: "formItem.field" },
  { key: "props.formItemLabel", mKey: "formItem.label" },
  { key: "props.formItemLabelTooltip", mKey: "formItem.helpMessage" },
  { key: "props.formItemRequired", mKey: "formItem.required" },
  { key: "props.defaultValue", mKey: "formItem.defaultValue" },
  { key: "props.wrapperCol", mKey: "formItem.colProps" },
  { key: "props.hidden", mKey: "formItem.show", mValue: (value) => !value },
  { key: "useAsFormItem", mKey: "formItem.useAsFormItem" },
]

/**
 * 全局映射
 */
const globalMapper: Mapper[] = [
  { key: "layoutType", mKey: "layout" },
  { key: "labelStyle.textAlign", mKey: "labelAlign" },
  { key: "labelStyle.width", mKey: "labelWidth" },
]

/**
 * 组件映射
 */
const widgetMapper: MapperType = {
  // key == type
  input: [
    { key: "type", mKey: "formItem.component", mValue: "Input" },
    { key: "props.maxLength", mKey: "props.maxlength" },
    { key: "props.inputShowCount", mKey: "props.showCount" },
  ],
  textarea: [
    { key: "type", mKey: "formItem.component", mValue: "InputTextArea" },
    { key: "props.minRows", mKey: "props.autoSize.minRows" },
    { key: "props.maxRows", mKey: "props.autoSize.maxRows" },
    { key: "props.maxLength", mKey: "props.maxlength" },
  ],
  "dict-select": [
    { key: "type", mKey: "formItem.component", mValue: "JDictSelectTag" },
    { key: "props.dictCompType", mKey: "props.type" },
    { key: "props.direction", mKey: "props.orientation" },
    { key: "props.directionMargin", mKey: "props.orientationMargin" },
    { key: "props.dictColProps", mKey: "props.colProps" },
  ],
  divider: [
    { key: "type", mKey: "formItem.component", mValue: "Divider" },
    { key: "props.divider_style", mKey: "props.style" },
    { key: "props.direction", mKey: "props.orientation" },
    { key: "props.directionMargin", mKey: "props.orientationMargin" },
  ],
  slot: [
    { key: "type", mKey: "formItem.component", mValue: "Input" },
    { key: "formItem.field", mKey: "formItem.slot" },
  ],
  alert: [
    { key: "type", mKey: "formItem.component", mValue: "MyAlert" },
    { key: "props.alertType", mKey: "props.type" },
    { key: "props.alertMessage", mKey: "props.message" },
    { key: "props.alertStyle", mKey: "props.style" },
  ],
  rate: [{ key: "type", mKey: "formItem.component", mValue: "Rate" }],
  switch: [
    { key: "type", mKey: "formItem.component", mValue: "Switch" },
    { key: "props.checkedText", mKey: "props.checkedChildren" },
    { key: "props.unCheckedChildren", mKey: "props.unCheckedText" },
  ],
}

const mapperField = (mapper, obj) => {
  let value = utils.getObjValue(obj, mapper.key)
  if (mapper.mValue) {
    value = isFunction(mapper.mValue) ? mapper.mValue(value) : mapper.mValue
  }
  if (value === undefined || value === null) {
    return false
  }
  // utils.deleteObjKey(obj, mapper.key)
  utils.addValueToObj(obj, mapper.mKey, value)
  return true
}

export const doMapperField = (designerConfig) => {
  const { widgetList, globalConfig } = designerConfig
  widgetList.forEach((newWidget) => {
    // 处理字段映射
    const mappers: any[] = [...widgetCommonMapper, ...widgetMapper[newWidget.type]] || []
    mappers
      .filter((e) => e.key && e.mKey)
      .forEach((mapper) => {
        mapperField(mapper, newWidget)
      })
  })

  // 全局配置映射
  globalMapper.forEach((mapper) => mapperField(mapper, globalConfig))
  return designerConfig
}
